<!DOCTYPE html>
<html lang="en">

	<head>
		<meta charset="utf-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="referrer" content="origin">
		<meta name="viewport"
			content="width=device-width, viewport-fit=cover, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
		<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
		<title>支付完成</title>
		<script type="text/javascript" src="/js/jquery-3.5.1.min.js"></script>
		<script type="text/javascript" charset="UTF-8" src="https://wx.gtimg.com/pay_h5/goldplan/js/jgoldplan-1.0.0.js">
		</script>
		<style>
			@font-face {
				font-family: "iconfont";
				/* Project id 2649930 */
				src: url('https://at.alicdn.com/t/c/font_2649930_6vjnygp5mjg.woff2?t=1692354083909') format('woff2'),
					url('https://at.alicdn.com/t/c/font_2649930_6vjnygp5mjg.woff?t=1692354083909') format('woff'),
					url('https://at.alicdn.com/t/c/font_2649930_6vjnygp5mjg.ttf?t=1692354083909') format('truetype');
			}

			.iconfont {
				font-family: "iconfont" !important;
				font-size: 16px;
				line-height: 1;
				font-style: normal;
				-webkit-font-smoothing: antialiased;
				-moz-osx-font-smoothing: grayscale;
			}

			.iconjishiwancheng:before {
				content: "\e6bd";
			}

			* {
				margin: 0;
				padding: 0;
			}


			body {
				font-family: PingFang SC, "Helvetica Neue", Arial, sans-serif;
			}

			.iconjishiwancheng {
				font-size: 70px;
				color: #19c865;
			}

			.c-title {
				color: #333;
			}

			.c-warning {
				color: #FF2404;
			}

			.f-md-title {
				font-size: 27px;
			}

			.f-sm-title {
				font-size: 18px;
			}

			.f-title {
				font-size: 16px;
			}

			.f-mini-title {
				font-size: 15px;
			}

			.f-small-title {
				font-size: 13px;
			}


			.mt-sm {
				margin-top: 5px;
			}

			.mt-md {
				margin-top: 10px;
			}

			.text-bold {
				font-weight: bold;
			}

			.b-1px-t {
				padding-top: 29px;
				border-top: 1px solid #eee;
			}


			.btn-list {
				padding: 40px 0;
			}

			.btn-item {
				width: 160px;
				height: 45px;
				border: 1px solid #979797;
				transform: rotateZ(360deg);
			}

			.btn-item:nth-child(2) {
				margin-left: 10px;
				color: #fff;
				background: #19c865;
				border: 1px solid #19c865;
			}

			.flex-column {
				display: flex;
				flex-direction: column;
			}

			.flex-center {
				display: flex;
				align-items: center;
				justify-content: center;
			}

			.flex-between {
				display: flex;
				align-items: center;
				justify-content: space-between;
			}

			.radius {
				border-radius: 100px;
			}
		</style>
		<script>
			// 初始化
			$(function() {
				// 初始化小票
				let initData = {
					action: 'onIframeReady',
					displayStyle: 'SHOW_CUSTOM_PAGE',
					height: "900"
				};
				let postData = JSON.stringify(initData);
				//与ifarem  交互
				//parent.postMessage(postData,'https://payapp.weixin.qq.com')
				top.postMessage(postData, '*')
				let out_trade_no = getUrlParam('out_trade_no')
				console.log(out_trade_no, "=====out_trade_no")
				if (out_trade_no) {
					let _href = window.location.href
					let url = _href.split('/items.html')[0]
					let ajax_url =
						`${url}/index.php?i=666&m=longbing_massages_city&s=massage/app/IndexOrder/adapayOrderInfo&urls=massage/app/IndexOrder/adapayOrderInfo`

					let data = {
						out_trade_no
					}
					$.ajax({
						type: 'get',
						url: `${ajax_url}`,
						dataType: 'json',
						async: false,
						data,
						success: function(res) {
							initOrderData(out_trade_no, res.data)
						}
					})
				} else {
					initOrderData(out_trade_no)
				}
			});

			function initOrderData(out_trade_no, detail = {
				id: 0
			}) {
				let {
					id = '',
						order_type,
						order_code,
						pay_price,
						init_material_price = 0,
						init_service_price = 0,
						car_price = 0,
						discount
				} = detail
				let text =
					`<div class="flex-center flex-column" style="padding:45px"><i class="iconfont iconjishiwancheng"></i><div class="f-mini-title text-bold c-title mt-sm">支付成功</div>`
				if (id) {
					text += `<div class="f-md-title c-title mt-md">¥` +
						pay_price + `</div></div>`
				} else {
					text += `<div class="f-small-title c-title mt-md"><text decode="emsp" style="word-break:break-all;">` +
						out_trade_no +
						`</text></div>`
				}
				text += `</div>`

				if (id) {
					let order_code_text = order_code.substring(order_code.length - 4, order_code
						.length)
					let total_price = (init_material_price * 1 + init_service_price * 1)
						.toFixed(2)

					text +=
						`<div class="f-mini-title" style="color:#898989;padding:0 27px"><div class="b-1px-t"></div>`
					text += `<div class="flex-between"><div>订单尾号</div><div class="c-title">` +
						order_code_text + `</div></div>`
					if (order_type == 'Massage') {

						if (car_price * 1 > 0 || discount * 1 > 0) {
							text +=
								`<div class="flex-between mt-md"><div>服务费用</div><div class="c-title">¥` +
								total_price + `</div></div>`
						}
						if (car_price * 1 > 0) {
							text +=
								`<div class="flex-between mt-md"><div>出行费用</div><div class="c-title">¥` +
								car_price + `</div></div>`
						}
						if (discount * 1 > 0) {
							text +=
								`<div class="flex-between mt-md"><div>卡券优惠</div><div class="c-warning">-¥` +
								discount + `</div></div>`
						}
					}
					text +=
						`<div class="flex-between mt-md"><div>实付金额</div><div class="c-title text-bold">¥` +
						pay_price + `</div></div>`
				}
				text +=
					`<div class="btn-list flex-center"><div onclick="toPage(1)" class="btn-item flex-center f-title c-title radius">回到首页</div>`
				if (order_type == 'Massage' || order_type == 'MassageUp') {
					text += `<div onclick="toPage(2)" class="btn-item flex-center f-title radius">订单列表</div>`
				} else if (order_type == 'Balance') {
					text += `<div onclick="toPage(4)" class="btn-item flex-center f-title radius">余额充值</div>`
				} else if (order_type == 'ResellerPay') {
					text += `<div onclick="toPage(5)" class="btn-item flex-center f-title radius">分销员端</div>`
				} else if (order_type == 'AgentRecharge') {
					text += `<div onclick="toPage(6)" class="btn-item flex-center f-title radius">管理员端</div>`
				} else if (order_type == 'Memberdiscount') {
					text += `<div onclick="toPage(7)" class="btn-item flex-center f-title radius">会员中心</div>`
				} else {
					text += `<div onclick="toPage(3)" class="btn-item flex-center f-title radius">个人中心</div>`
				}
				text += `</div>`
				$(".html-box").html(text)
			}

			/***
			 * 跳转至其他页面
			 ***/
			function toPage(type) {
				let _href = window.location.href
				let url = _href.split('/items.html')[0]
				let page = {
					1: `${url}/h5`,
					2: `${url}/h5/#/pages/order`,
					3: `${url}/h5/#/pages/mine?type=1`,
					4: `${url}/h5/#/user/pages/stored/list?paysuc=1`,
					5: `${url}/h5/#/user/pages/distribution/income`,
					6: `${url}/h5/#/agent/pages/index?agent=1&paysuc=1`,
					7: `${url}/h5/#/memberdiscount/pages/index?paysuc=1`,
				}
				let mchData = {
					action: 'jumpOut',
					jumpOutUrl: page[type]
				}
				let postData = JSON.stringify(mchData)
				//parent.postMessage(postData,'https://payapp.weixin.qq.com')
				top.postMessage(postData, '*')
			}

			// 获取地址栏参数
			function getUrlParam(name) {
				var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); //构造一个含有目标参数的正则表达式对象
				var r = window.location.search.substr(1).match(reg); //匹配目标参数
				if (r != null) return unescape(r[2]);
				return null; //返回参数值
			}
		</script>
	</head>

	<body>
		<div class="html-box"></div>
	</body>
</html>